<{php}>
if(isset($config['syscat_index_seo_title']['cvalue'])){
$title = $config['syscat_index_seo_title']['cvalue'];
}
if(isset($config['syscat_index_seo_keywords']['cvalue'])){
$keywords = $config['syscat_index_seo_keywords']['cvalue'];
}
if(isset($config['syscat_index_seo_desc']['cvalue'])){
$description = $config['syscat_index_seo_desc']['cvalue'];
}
<{/php}>

<{include file="../template/public/head.html"}>
<link rel="stylesheet" type="text/css" href="/static/css/css.css?v=1" />
<style type="text/css">

    .pro-banner{
        background:url(<{if condition="isset($config.product_syscat_banner.cvalue)"}><{$config.product_syscat_banner.cvalue}><{/if}>);
        background-size:100% 100%;
    }
    @media (max-width: 1200px) {
        .pro-banner{
            display:none;
            background: url(<{if condition="isset($config.product_syscat_banner.cvalue)"}><{$config.product_syscat_banner.cvalue}><{/if}>) no-repeat center center !important;
        }
    }
    .small-a{
        display:none;
    }
    @media (max-width:767px){

        .hover-fadeIn .img-hover{
            opacity: 1;
            position:static;
            height: 38px;
        }
        .hover-fadeIn .hover-text{
            opacity: 1;
            transform: scale(1,1);
            line-height: 12px;
            font-size: 12px !important;
            font-weight: normal !important;
            height: 12px;
        }
        .hover-fadeIn .hover-text a:first-child{
            opacity: 1;
            display: inline;
            font-size: 12px;
            font-weight: normal;
            line-height: 14px;
        }
        .hover-fadeIn .hover-text a {
            display:none;
            color:#666;
        }
        .border-bottom{
            border:0;
        }
        .big-a{
            display:none !important;
        }
        .small-a{
            display:block;
        }
        section{margin-top:0 !important;padding-top:0 !important;}
        .container >div:first-child{margin-top:0 !important;}
    }
</style>
<!-- header-->
<!-- pro_top -->
<{include file="../template/public/union_nav.html"}>

<script>
    /*$('link').each(function(){
        if($(this).attr('href').indexOf("css/style.css")>0){
            $(this).remove();
            return false;
        }
    });*/
</script>
<div class="container-fluid">
    <div class="row">
        <div class="banner pro-banner">
            <div class="container">
                <div class="row">
                    <div class="col-sm-7">
                        <div class="text">
                            <h1 class="white"><{if condition="isset($config.product_syscat_title.cvalue)"}><{$config.product_syscat_title.cvalue}><{/if}></h1>
                            <p><{if condition="isset($config.product_syscat_desc.cvalue)"}><{$config.product_syscat_desc.cvalue}><{/if}></p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>



<div class="container hidden-lg hidden-md">
    <div class="row">
        <div class="col-sm-12">
            <div class="text">
                <h1 style="text-align:center;font-size:18px;color:black;"><{if condition="isset($config.product_syscat_title.cvalue)"}><{$config.product_syscat_title.cvalue}><{/if}></h1>
                <!--<p><{if condition="isset($config.product_syscat_desc.cvalue)"}><{$config.product_syscat_desc.cvalue}><{/if}></p>-->
            </div>
        </div>
    </div>
</div>



<!-- 按照系统分类的产品 暂时全部隐藏-->
<section class="hidden-lg hidden-md hidden-sm hidden-xs">
    <{php}>
        $products = $query->getProductsForCat('sys_cat');
    <{/php}>
    <{php}>
        $productCatsByLevel = $query->getProductCat('sys');

        $productCats = array_chunk($productCatsByLevel,3);
    <{/php}>
    <{volist name="productCats" id="part" key="partKey"}>
    <div class="tab-container pro-tab-container hidden-xs jq_tab" id="jq_tab_<{$partKey}>">
        <ul class="nav nav-tabs center-block text-center jq_tab_fade " role="tablist" >
            <{volist name="part" id="item" key="itemKey"}>
            <li role="presentation" data-env="jq_tab_<{$partKey}>"><a style="width:340px" href="#" class="btn btn-default btn-label" data-fade="#data-fade-<{$itemKey}>-<{$partKey}>"><{$item.name}></a></li>
            <{/volist}>
        </ul>
        <div class="tab-content" data-env="jq_tab_<{$partKey}>">
            <{volist name="part" id="item" key="itemKey"}>
            <div role="tabpanel" class="tab-pane" id="data-fade-<{$itemKey}>-<{$partKey}>">
                <div class="container-fluid pro-sec">
                    <div class="row">
                        <div class="tab-slide center-block">
                            <div class="collapse tab-toggle in clearfix" >
                                <div class="sec-desc clearfix center-block text-center">
                                    <{if condition="!empty($item['sub'])"}>
                                    <{volist name="item.sub" id="sub" key="partAgainKey"}>
                                    <ul class="list-unstyled" style="width:340px;margin-right:15px;">
                                        <li><h3><{$sub.name}></h3></li>
                                        <{if condition="(isset($products[$sub['id']]))"}>
                                        <{volist name="$products[$sub['id']]" id="product"}>
                                        <li><a href="<{php}> echo $query->U('index/product/product/id/'.$product['id'],true);<{/php}>"><{$product.name}></a></li>
                                        <{/volist}>
                                        <{/if}>
                                    </ul>
                                    <{/volist}>
                                    <{/if}>

                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <{/volist}>
        </div>
    </div>
    <{/volist}>



    <div class="divider1 hidden-xs"></div>
    <div class="container pro-sec">
        <div class="text-center center-block pro-list">
            <h1>Reinforcement material</h1>
            <a href="javascript:;" class="more"><{:lang('See more')}></a>
            <p class="head-desc">With one-stop advanced construction reinforcement materials manufacturing, six systems, including more than 30 strengthening materials, we make it easy for you to obtain the majority of products required in the majority of reinforcement projects.</p>
            <div class="row">
                <{volist name="productCats" id="part" key="partKey"}>
                <{volist name="part" id="item" key="itemKey"}>
                <div class="col-md-4 col-sm-4 col-xs-6 pro-item border-right border-bottom hover-fadeIn" id="pd-0">
                    <div class="imgbox">
                        <a href="<{php}> echo $query->U('index/product/syslist/id/'.$item['id'],true);<{/php}>"><img src="<{$item.cover}>" alt="" class="img-responsive center-block" style="display:inline;"></a>
                    </div>
                    <div class="img-hover">
                        <div class="hover-text">
                            <a href="<{php}> echo $query->U('index/product/syslist/id/'.$item['id'],true);<{/php}>"><{$item.name}></a>
                            <{if condition="!empty($item['sub'])"}>
                            <{volist name="item.sub" id="sub" key="partAgainKey"}>
                                <{if condition="(isset($products[$sub['id']]))"}>
                                <{volist name="$products[$sub['id']]" id="product"}>
                                <a href="<{php}> echo $query->U('index/product/product/id/'.$product['id'],true);<{/php}>"><{$product.name}></a>
                                <{/volist}>
                                <{/if}>
                            <{/volist}>
                            <{/if}>
                        </div>
                    </div>
                </div>
                <{/volist}>
                <{/volist}>
            </div>
        </div>
    </div>
</section>



<!--最新的排版方法 按照分类 列出所有产品 目前用这个2018-11-9-->

<section class="container" style="background:white;">
    <{volist name="$productCatsByLevel" id="item"}>
    <div class="container-fluid mt65 mb65 news">
        <div class="container-fluid">
            <div class="row  ">
                <div class="col-sm-6 row">
                    <a href="<{php}> echo $query->U('index/product/syslist/id/'.$item['id'],true);<{/php}>"><img src="<{$item.cover}>" width="475" height="240" alt="" class="img-responsive" /></a>
                </div>
                <div class="col-sm-6">
                    <div class="text">

                        <h2><strong><a href="<{php}> echo $query->U('index/product/syslist/id/'.$item['id'],true);<{/php}>"><{$item.name}></a></strong></h2>
                        <p><{$item.desc}></p>
                        <ul style="padding:0;margin-top:10px;">
                            <{volist name="$item.sub" id="subItem"}>
                                <{if condition="!empty($products[$subItem.id])"}>
                                    <{volist name="$products[$subItem.id]" id="product"}>
                                    <a href="<{php}> echo $query->U('index/product/product/id/'.$product['id'],true);<{/php}>"><li style="color:#333;text-decoration:underline;"><{$product.name}></li></a>
                                    <{/volist}>
                                <{/if}>
                            <{/volist}>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <{/volist}>
</section>



<!--推荐产品-->
<section class="hidden-lg hidden-md hidden-sm hidden-xs">
    <div class="container pro-sec">
        <div class="text-center center-block">
            <h1>Core Product</h1>
            <p class="head-desc"><!--Having experienced the development of circle vibrating screening equipment of Y series, YKN series and S5X series, the ore processing and screening equipment of SBM has gradually overcome the defects and disadvantages of traditional screening equipment and achieved international advanced level in both production technology and the screening efficiency and life expectancy of vibrating sieve, and become the indispensable choices the ore processing enterprise domestically and abroad.--></p>
            <div class="row">
                <{php}>$recommendProducts = $query->getRecommendProduct();<{/php}>
                <{volist name="recommendProducts" id="item"}>
                <{if condition="($key lt 6)"}>
                <div class="col-md-4 col-sm-4 col-xs-6 border-right hover-fadeIn">
                    <div class="imgbox">
                        <a href="<{php}> echo $query->U('index/product/product/id/'.$item['id'],true);<{/php}>"><img src="<{$item.cover}>" alt="" class="img-responsive center-block" /></a>
                    </div>
                    <div class="img-hover">
                        <h3 class="big-a"><a href="<{php}> echo $query->U('index/product/product/id/'.$item['id'],true);<{/php}>"><{$item.name}></a></h3>
                        <a class="small-a" href="<{php}> echo $query->U('index/product/product/id/'.$item['id'],true);<{/php}>"><{$item.name}></a>
                    </div>
                </div>
                <{/if}>
                <{/volist}>
            </div>
        </div>
    </div>
</section>
<{include file="../template/public/sidebar.html"}>
<{include file="../template/public/foot.html"}>